<input type="file" id="audioFile" accept=".wav">
<button onclick="uploadFile()">上传文件</button>

<p id="fileName"></p>  <!-- 用来显示文件名 -->

<script>
async function uploadFile() {
  const fileInput = document.getElementById("audioFile");
  const fileNameDisplay = document.getElementById("fileName");

  if (!fileInput.files.length) {
    alert("请选择一个 WAV 文件！");
    return;
  }

  const file = fileInput.files[0];
  const formData = new FormData();
  formData.append("file", file);

  try {
    const response = await fetch("http://127.0.0.1:5000/api/uploads", {
      method: "POST",
      body: formData
    });

    if (!response.ok) {
      const text = await response.text();
      alert("上传失败：" + text);
      return;
    }

    const data = await response.json();
    alert("上传成功！文件路径：" + data.file_path);

    // 显示上传文件名
    fileNameDisplay.textContent = `已上传文件：${file.name}`;

  } catch (err) {
    alert("上传请求出错：" + err.message);
  }
}
</script>
